/*
 * 地址选择
 */
'use strict';
import React, { Component } from 'react';
import {
    StyleSheet,
    Text,
    View,
    TouchableHighlight,
    Image,
    PixelRatio,
    TextInput,
} from 'react-native';


import Toast from 'antd-mobile/lib/toast';
import List from 'antd-mobile/lib/list';
import InputItem from 'antd-mobile/lib/input-item';

import NavTitle from '../component/NavTitle';

import Forget from './Forget';

import { connect } from 'react-redux';
import {changeAddress} from '../action/address';

const Item = List.Item;

import { createForm } from 'rc-form';

class ChangePwd extends Component {
    constructor(props) {
        super(props)

        this.state = {

        }
    }

    componentDidMount(){
    }

    _forgetPwd(){
        this.props.navigator.push({
            name:'Forget',
            component:Forget
        })
    }

    _changePwd(){
        this.props.form.validateFields((error, value) => {
            if(!error){
                this.setState({
                    animating:true
                });
                let _body = {
                    ...value,
                }
                let formData = new FormData();

                Object.keys(_body).map(ele=>{
                    formData.append(ele, _body[ele]);
                });
                XFetch(`http://www.weiweigo.com/app/member.aspx?method=editPwd`,{
                    method:'POST',
                    body:formData
                }).then(data=>{
                    if(data){
                        Toast.success(data, 1);
                        this.setState({
                            animating:false
                        })
                        this.props.navigator.pop();
                    }
                });
            }
        })
    }

    checkPassword = (rule, value, callback) => {
        const form = this.props.form;
        if (value && value !== form.getFieldValue('pwd')) {
            callback('两次密码不一致!');
        } else {
            callback();
        }
    }

    render() {
        const { getFieldProps } = this.props.form;
        return (
            <View style={styles.container}>
                <NavTitle
                    title='修改密码'
                    leftButton = {true}
                    leftText = {'返回'}
                    leftImg = {require('../imgs/left.png')}
                    leftHander = {()=>{this.props.navigator.pop()}}
                    headColor = '#fbdc3a'
                />
                <View style={styles.content}>
                    <InputItem
                        clear
                        placeholder="新密码"
                        type='password'
                        {...getFieldProps('beforePwd',{
                            rules: [{required: true}],
                        })}
                        labelNumber={5}
                        maxLength = {6}
                    >旧密码</InputItem>

                    <InputItem
                        clear
                        placeholder="密码"
                        type='password'
                        {...getFieldProps('nowPwd',{
                            rules: [{required: true}],
                        })}
                        labelNumber={5}
                        maxLength = {20}
                    >密码</InputItem>

                    <InputItem
                        clear
                        placeholder="重复密码"
                        type='password'
                        {...getFieldProps('cpwd',{
                            rules: [
                                {required: true},
                                {validator: this.checkPassword.bind(this),}
                            ],
                        })}
                        labelNumber={5}
                        maxLength = {20}
                    >密码重复</InputItem>

                    <TouchableHighlight
                        style={styles.loginBtn}
                        onPress={this._changePwd.bind(this)}
                    >
                        <Text style={styles.loginText}>确定</Text>
                    </TouchableHighlight>

                </View>
            </View>
        )
    }

}

const styles = StyleSheet.create({
    container: {
        backgroundColor: '#EEEEEF',
        flex: 1,
    },
    itemStyle:{
        flexDirection:'row'
    },
    keys:{
        marginRight:10,
    },
    content:{
        padding:20,
    },
    textInput:{
        padding:5,
        paddingLeft:10,
        borderWidth:1/PixelRatio.get(),
        marginTop:20,
        borderRadius:4,
        borderColor:'#CCC'
    },
    loginBtn:{
        padding:15,
        backgroundColor:'#FBDC3A',
        marginTop:20,
        borderRadius:3,
        justifyContent:'center',
        alignItems:'center'
    },
    loginText:{
        fontSize:16
    },
});

export default createForm()(ChangePwd);

